<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="../vue-2.4.0.js"></script>
  </head>
  <body>
    <div id="box">
    <!-- 1. 括号里不加引号的都是我们data里的数据读取
    2. 如果想使用字符串需要加上引号
    3. 里面可以写表达式
    4. 里面也可以调用定义好的方法，拿到的是方法的返回值 -->
    <!-- v-bind:属性 -->
    <!-- 简写方式  ：属性 -->
      <button :title="hi">按钮</button>
     <!-- 点击事件v-onclick -->
     <!-- 简写方式@click -->
      <button @click="add()">按钮</button>
      {{domo1}}
    </div>
  </body>
  <script>
    //   v- bind 和 v-on
    let vu = new Vue({
      el: "#box",
      data: {
        hi: "晚安世界",
        domo1:"1"
      },
      methods:{
        add(){
            this.domo1++
        }
      }
    });
  </script>
</html>
